<template>
	<div class="keep-note" :style="noteStyle">
		<div class='note-content' :style="noteConStyle">
		    <img src="../../assets/gantanhao.png" alt="" />
		    <h2>{{contentData}}</h2>
		    <div class="note-bottom">
		    	<span class="yesShow" @click="clickYes">是</span>
		   		<span @click="clickNo">否</span>
		    </div>
		</div>
	</div>
</template>

<script>
  export default {
  	props: ['contentData'],
    data () {
      return {
        noteStyle: { // keepnote的大小
          width: '400px',
          height: '390px'
        },
        noteConStyle: { // keepnote位置
          marginTop: '200px',
          marginLeft: '200px'
        }
      }
    },
    mounted () {
      var that = this
      function changeShiTu (shiTu) {
        var stWidth = window.innerWidth
        var stHeight = window.innerHeight
        var marTop = stHeight / 2 - 195
        var marLeft = stWidth / 2 - 156
        shiTu.noteStyle.width = stWidth + 'px'
        shiTu.noteStyle.height = stHeight + 'px'
        shiTu.noteConStyle.marginTop = marTop + 'px'
        shiTu.noteConStyle.marginLeft = marLeft + 'px'
      }
      changeShiTu(that)
      window.onresize = function () {
        changeShiTu(that)
      }
      
    },
    methods: {
    	clickYes () {
    		this.$emit('keepNoteYes')
    	},
    	clickNo () {
    		this.$emit('keepNoteNo')
    	}
    }
  }
</script>

<style scoped>
	@import '../../../static/components/public/keepNote.css'
</style>